<template>
	<view>
		<!-- 1，头部导航组件 -->
		<user-head ref="userHeadRef" @removeUser="removeUser" :userNum="userNum"></user-head>
		<!-- 2，搜索框 -->
		<user-search @searchUser="searchUser" :selectUser="selectUser"></user-search>
		<!-- 3，主要成员框 -->
		<user-data :groupUsers="groupUserData" @checkedRadio="checkedRadio"></user-data>
	</view>
</template>

<script>
	import userHead from './child/user-head.vue'
	import userSearch from './child/user-search.vue'
	import userData from './child/user-data.vue'

	import {
		queryGroupUsers,
		deleteGroupByIds,
	} from '@/api/http/msg/group.js'

	import {
		getNowTime
	} from '@/utils/time/time.js'

	export default {
		components: {
			userHead,
			userSearch,
			userData
		},
		data() {
			return {
				userNum: 0,
				groupId: 0,
				groupHead: '',
				groupName: '',
				groupUserData: [],
				selectUser: [],

				userId: uni.getStorageSync('userId'),
				nickname: uni.getStorageSync('nickname'),
				head: uni.getStorageSync('head'),
			}
		},
		methods: {
			queryGroupUsers(groupId, searchName) {
				var that = this
				queryGroupUsers(groupId, searchName, '', '1').then(res => {
					if (res.data.pubInfo.code !== 0) {
						return uni.$showMsg(res.data.pubInfo.message);
					}
					var busInfo = res.data.busInfo
					for (var i = 0; i < busInfo.length; i++) {
						busInfo[i].isRadio = false
					}
					//console.log(busInfo)

					this.groupUserData = busInfo
					//that.groupUserData = busInfo
				})
			},
			searchUser(e) {
				this.queryGroupUsers(this.groupId, e)
			},
			checkedRadio(e) {
				//console.log(e)
				if (e.isRadio) {
					for (var i = 0; i < this.groupUserData.length; i++) {
						if (this.groupUserData[i].userId == e.userId) {
							this.groupUserData[i].isRadio = !this.groupUserData[i].isRadio
							//console.log(123)
							for (var j = 0; j < this.selectUser.length; j++) {
								if (this.selectUser[j].userId == e.userId) {
									this.selectUser.splice(j, 1)

									this.$refs.userHeadRef.changeUserNum(this.selectUser.length)
									//this.userNum = this.selectUser.length
								}
							}
						}
					}
				} else {
					for (var i = 0; i < this.groupUserData.length; i++) {
						if (this.groupUserData[i].userId == e.userId) {
							//console.log(this.groupUserData[i].isRadio)
							this.groupUserData[i].isRadio = !this.groupUserData[i].isRadio

							this.selectUser.push(e)

							this.$refs.userHeadRef.changeUserNum(this.selectUser.length)
						}
					}
				}


			},

			removeUser() {
				if (this.selectUser.length == 0) {
					return uni.$showMsg('请选择成员');
				}

				//数据处理
				var removeUsers = ''
				for (var i = 0; i < this.selectUser.length; i++) {
					removeUsers += this.selectUser[i].userId
					if (i != (this.selectUser.length - 1)) {
						removeUsers += ','
					}
				}
				//console.log(removeUsers)
				deleteGroupByIds(parseInt(this.groupId), removeUsers).then(res => {
					if (res.data.pubInfo.code !== 0) {
						return uni.$showMsg(res.data.pubInfo.message);
					}

					var that = this
					for (var i = 0; i < this.selectUser.length; i++) {

						var msgJson = {
							msg: '用户：' + this.selectUser[i].nickname + '被踢出群聊',
							userId: this.selectUser[i].userId
						}

						let msgData = {
							type: this.$chatType.QUIT_GROUP,
							msg: {
								groupId: that.groupId,
								senderId: that.userId,
								senderHead: that.head,
								senderName: that.nickname,
								types: this.$chatType.KICK_OUT_USER, //消息类型 （0文本，1图片连接，2音频，3地图）
								message: JSON.stringify(msgJson), //消息 
								time: getNowTime(),
								groupHead: this.groupHead,
								groupName: this.groupName,
								state: 0
							}
						}
						console.log(msgData)

						uni.myWebsocket.socketTask.send({
							data: JSON.stringify(msgData),
							async success() {

								uni.$showMsg('踢出成功！');

								setTimeout(() => {
									that.queryGroupUsers(that.groupId, '')
								}, 200)
							}
						})
					}
				})
			}
		},
		onLoad(e) {
			this.groupId = e.groupId
			this.groupHead = e.groupHead
			this.groupName = e.groupName
			this.queryGroupUsers(e.groupId, '')
		}
	}
</script>

<style>

</style>